<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>后台管理系统-保理软件</title>
    <meta name="keywords" content="保理软件,保理产品"/>
    <meta name="description" content="设置描述..."/>
    <meta name="author" content="DeathGhost"/>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <!--产品logo-->
    <link rel="icon" href="${pageContext.request.contextPath}/images/icon/favicon.ico" type="image/x-icon">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/style.css"/>

    <%--设置服务器路径--%>
    <script>var http = "${pageContext.request.contextPath}";</script>

    <!--jQuery v3.2.1-->
    <script src="${pageContext.request.contextPath}/javascript/jquery.js"></script>
    <!--jquery.easyui v1.3.4-->
    <script src="${pageContext.request.contextPath}/javascript/jquery.easyui.min.js"></script>
    <!--滚动插件-->
    <script src="${pageContext.request.contextPath}/javascript/plug-ins/customScrollbar.min.js"></script>
    <!--统计插件-->
    <script src="${pageContext.request.contextPath}/javascript/plug-ins/echarts.min.js"></script>
    <!--弹框插件-->
    <script src="${pageContext.request.contextPath}/javascript/plug-ins/layerUi/layer.js"></script>
    <!--HTML编辑器插件-->
    <script src="${pageContext.request.contextPath}/editor/ueditor.config.js"></script>
    <!--HTML编辑器插件-->
    <script src="${pageContext.request.contextPath}/editor/ueditor.all.js"></script>
    <!--分页插件-->
    <script src="${pageContext.request.contextPath}/javascript/plug-ins/pagination.js"></script>
    <!--整个模板样式控制文件-->
    <script src="${pageContext.request.contextPath}/javascript/public.js"></script>
    <style>
        .form-group-col-2 .form-label {
            padding: 3px 0px !important;
            font-size: 12px !important;
            width: 115px;
            font-weight: bolder;
        }

        .form-group-col-2 .form-cont {
            margin-left: 125px;
            min-height: 33px;
        }

        .form-control {
            font-size: 12px !important;
            padding: 4px 15px !important;
        }

        #file {
            position: absolute;
            top: 0;
            right: 80px;
            z-index: 999;
            opacity: 0;
            width: 100px;
            height: 25px;
        }
    </style>
</head>
<body>
<!--软件主体内容-->
<main class="content mCustomScrollbar">
    <!--开始::内容-->
    <div class="page-wrap">
        <!--面包屑-->
        <section class="page-hd page-hd-top">
            <div class="breadcrumb">
                <ul>
                    <li>权限管理<i class="icon-angle-right"></i></li>
                    <li>新增资源</li>
                </ul>
            </div>
        </section>
        <div class="clear mb-10">
            <button class="btn btn-secondary radius fr ml-15"
                    style="padding: 4px 15px!important;font-size: 12px!important;"
                    onclick="addOrUpdateResource(0);">新增资源
            </button>

        </div>
        <!--列表-->
        <table class="table mb-15 table-hover">
            <thead>
            <tr>
                <th>菜单名称</th>
                <th>菜单id</th>
                <th>地址</th>
                <th>类型</th>
                <th>排序</th>
                <th>图标</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <c:forEach items="${datalist}" var="resource">
                <tr class="cen" style="background-color: rgba(172,140,133,0.2)">
                    <td style="text-align: left">${resource.sysResourceName}</td>
                    <td>${resource.sysid}</td>
                    <td>${resource.url}</td>
                    <td>顶级菜单</td>
                    <td>${resource.sort}</td>
                    <td>${resource.icon}</td>
                    <td>
                        <a title="修改" class="mr-5"  onclick="addOrUpdateResource('${resource.sysid}')">修改</a>
                    </td>
                </tr>
                <c:if test="${not  empty resource.childs }">
                    <c:forEach items="${resource.childs}" var="child">
                        <tr class="cen">
                            <td style="text-align: left">├───${child.sysResourceName}</td>
                            <td>${child.sysid}</td>
                            <td>${child.url}</td>
                            <td>一般菜单</td>
                            <td>${child.sort}</td>
                            <td>${child.icon}</td>
                            <td>
                                <a title="修改" class="mr-5" onclick="addOrUpdateResource('${child.sysid}')">修改</a>
                            </td>
                        </tr>
                    </c:forEach>
                </c:if>
            </c:forEach>
            </tbody>
        </table>
    </div>
    <!--开始::结束-->
</main>

<div id="resourceInfo" style="display: none;">
    <div class="page-wrap">
        <div class="form-group-col-2">
            <div class="form-label">资源名称 ：</div>
            <div class="form-cont">
                <input type="hidden" id="sysid">
                <input type="text" placeholder="资源名称" id="sysResourceName" class="form-control form-boxed"
                       style="width: 360px">
            </div>
        </div>
        <div class="form-group-col-2">
            <div class="form-label">类型 ：</div>
            <div class="form-cont">
                <%--<input type="text" placeholder="顶级菜单填写module,一般菜单填写menu" id="type" class="form-control form-boxed" style="width: 360px">--%>
                    <select class="form-control form-boxed" id="type" style="width: 360px">
                        <option value="module">顶级菜单</option>
                        <option value="menu">一般菜单</option>
                    </select>
            </div>
        </div>
        <div class="form-group-col-2">
            <div class="form-label">url ：</div>
            <div class="form-cont">
                <input type="text" placeholder="资源url[顶级菜单不用填写]" id="url" class="form-control form-boxed" style="width: 360px">
            </div>
        </div>
        <div class="form-group-col-2">
            <div class="form-label">上级节点id ：</div>
            <div class="form-cont">
                <input type="text" placeholder="上级节点id[顶级菜单不用填写]" id="pid" class="form-control form-boxed"
                       style="width: 360px">
            </div>
        </div>
        <div class="form-group-col-2">
            <div class="form-label">排序 ：</div>
            <div class="form-cont">
                <input type="text" placeholder="排序" id="sort" class="form-control form-boxed"
                       style="width: 360px">
            </div>
        </div>
        <div class="form-group-col-2">
            <div class="form-label">图标 ：</div>
            <div class="form-cont">
                <input type="text" placeholder="图标" id="icon" class="form-control form-boxed"
                       style="width: 360px">
            </div>
        </div>
        <div style="clear: both;width: 25%;margin: 10px auto 15px;">
            <button class="btn btn-primary-outline btn-block" onclick="saveResource()">保存</button>
        </div>
    </div>
</div>
<script>

    //删除资源
    function deleteResource(obj) {
        parent.layer.confirm('您确定删除该账号吗？', {
            btn: ['确定', '取消']
        }, function () {
            layer.msg('<span><span class="icon-spin icon-spinner"></span>删除中 . . . .</span>');
            parent.layer.closeAll();
        });
    }

    //初始化资源信息
    function initResource(id) {
        var sysid = $("#sysid");
        var sysResourceName = $("#sysResourceName");
        var type = $("#type");
        var url = $("#url");
        var pid = $("#pid");
        var sort = $("#sort");
        var icon = $("#icon");
        if (id == 0) {
            sysid.val("0");
            sysResourceName.val("");
            type.val("");
            url.val("");
            pid.val("");
            sort.val("");
            icon.val("");
        } else {
            $.get("${pageContext.request.contextPath}/resourcecontroller/resources_getResource", {"sysid": id}, function (data) {
                if (data.code == 1) {
                    sysid.val(id);
                    sysResourceName.val(data.data.sysResourceName);
                    type.val(data.data.type);
                    url.val(data.data.url);
                    pid.val(data.data.pid);
                    sort.val(data.data.sort);
                    icon.val(data.data.icon);
                } else {
                    layer.msg("*" + data.message);
                }
            });
        }
    }
    function addOrUpdateResource(id) {
        initResource(id);
        var text = id == 0 ? '新增' : '修改';
        layer.open({
            type: 1,
            skin: 'layui-layer-demo',
            title: text + "资源",
            closeBtn: 2,
            area: ['600px', '350px'],
            shade: [0.1, '#fff'],
            shadeClose: true, //开启遮罩关闭
            scrollbar: false,//屏蔽浏览器出现滚动条
            content: $('#resourceInfo')
        });
    }

    function saveResource() {
        var sysid = $("#sysid").val();
        var sysResourceName = $("#sysResourceName").val();
        var type = $("#type").val();
        var url = $("#url").val();
        var pid = $("#pid").val();
        var sort = $("#sort").val();
        $.post("${pageContext.request.contextPath}/resourcecontroller/resources_saveResource", {
            "sysid": sysid,
            "sysResourceName": sysResourceName,
            "type": type,
            "url": url,
            "sort": sort,
            "pid": pid
        }, function (data) {
            layer.msg("*" + data.message);
            if (data.code == 1) {
                layer.closeAll();
                window.location.reload();
            }
        });
    }

</script>
</body>
</html>

